import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';

import { HomeComponent } from './home/home.component';
import { ProductListComponent } from './product/product-list/product-list.component';
import { ProductDetailComponent } from './product/product-detail/product-detail.component';
import { CartComponent } from './product/cart/cart.component';
import { ShippingComponent } from './product/shipping/shipping.component';

import { HeroListComponent } from './hero/hero-list/hero-list.component';

import { StudyPhpComponent } from './study-php/study-php.component';

const routes: Routes = [{
  path: '',
  component: HomeComponent
},{
  path: 'product-list',
  component: ProductListComponent
},{
  path: 'product/:productId',
  component: ProductDetailComponent,
},{
  path: 'cart',
  component: CartComponent,
},{
  path: 'shipping',
  component: ShippingComponent,
},{
  path: 'hero-list',
  component: HeroListComponent,
  data: { title: 'Heroes List' }
},{
  path: 'php',
  component: StudyPhpComponent
}];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }
